@import '@/app/styles/variables';

.container {
  position: relative;
  display: flex;
  width: 704px;
  padding: 56px 56px 48px 56px;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 32px;
  border-radius: 32px;
  background: #fff;
  box-sizing: border-box;
}

.visible {
  display: none;
}

.isModalContainer {
  display: flex;
  flex-direction: column;
  align-items: center;
  height: 100%;
  justify-content: flex-start;
  gap: 32px;
  background: #fff;
}

.isModalContainer::-webkit-scrollbar {
  width: 0px;
}

.smallGap {
  gap: 16px;
}

.container::after {
  height: 32px;
}

@include media(sm) {
  .container {
    overflow-x: hidden;
    padding: 18px 16px 0px 16px;
    gap: 16px;
    width: 100vw;
    max-height: 100%;
  }

  .isModalContainer {
    overflow: visible;
  }
}
